/* eslint-disable react/no-unknown-property */
/* eslint-disable react/jsx-no-duplicate-props */
/* eslint-disable no-param-reassign */
/* eslint-disable array-callback-return */
import IconFont from '@/components/IconFont';
import { doFetch, getFetch, postFetch } from '@/utils/doFetch';
import { QuestionOutlined, WechatFilled, CaretRightOutlined, UserAddOutlined, LoadingOutlined } from '@ant-design/icons';
import {
  ProForm,
  ProFormDatePicker,
  ProFormDigit,
  ProFormGroup,
  ProFormList,
  ProFormRadio,
  ProFormSelect,
  ProFormText,
  ProFormUploadButton,
  ProFormCascader,
  ProFormDependency
} from '@ant-design/pro-components';
import { history, useModel } from '@umijs/max';
import {
  Button,
  Col,
  Divider,
  Form,
  Popconfirm,
  Popover,
  Avatar,
  Tooltip,
  Typography,
  Collapse,
  message,
  theme,
  Row,
  Checkbox,
  Cascader,
  Select,
  Input,
  Empty,
  Switch
} from 'antd';
import dayjs from 'dayjs';
import { memo, useEffect, useMemo, useRef, useState } from 'react';
import Switches from '../Switches';
import Bglight from './Bglight';
import EditorItem from './EditorItem';
import Header from './Header';
import LogoUrl from './LogoUrl';
import { useLocation } from '@umijs/max';
import useCurrentUser from '@/utils/useCurrentUser';
import { useRequest } from 'ahooks';
import copy from 'copy-to-clipboard';
import { v4 as uuidv4 } from 'uuid';

const { Paragraph } = Typography;

const disabledDate = (current) => {
  // Can not select days before today and today
  return current && current < dayjs().startOf('day');
};

const Add = ({ refresh }) => {
  return (
    <ProForm
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        let res = await postFetch({
          url: '/org',
          params: { ...values },
        });
        if (res?.code === 0) {
          message.success('创建并绑定成功！');
          refresh?.();
        }
      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
    >
      <ProFormText
        name="orgName"
        tooltip="最长为 24 位"
        label="团队名称"
        placeholder="请输入名称"
        fieldProps={{
          showCount: true,
          maxLength: 24,
        }}
        rules={[
          {
            required: true,
            message: '请输入名称!',
          },
        ]}
      />
    </ProForm>
  );
};

const Join = ({ refresh }) => {

  return (
    <ProForm
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        let res = await doFetch({
          url: '/user/joinOrg',
          params: { ...values },
          method: 'PUT',
        });
        refresh?.();
      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
    >
      <ProFormText
        name="orgJoinKey"
        label="邀请码"
        placeholder="请输入邀请码"
        tooltip={{
          title: '邀请码由目标团队分享给您',
          placement: "right"
        }}
        rules={[
          {
            required: true,
            message: '请输入邀请码!',
          },
        ]}
      />
    </ProForm>
  );
};

const Pwd = ({ oldpwd }) => {
  const formRef = useRef();
  useEffect(() => {
    setTimeout(() => {
      formRef?.current?.setFieldsValue({ oldpwd: null });
    });
  }, [formRef]);

  return (
    <ProForm
      autoComplete={'off'}
      formRef={formRef}
      layout={'vertical'}
      style={{ marginTop: 24 }}
      initialValues={{
        oldpwd: oldpwd,
      }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        let res = await doFetch({
          url: '/system/user',
          params: {
            password: oldpwd ?? values?.oldpwd,
            newPassword: values?.password,
          },
          method: 'PUT',
        });
        if (res?.code === 0) {
          doFetch({ url: '/system/logout', params: {} }).then(() => {
            localStorage.removeItem('TOKENES');
            history.push('/user/login');
            message.success('密码修改成功，请重新登录');
          });
        }
      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
    >
      <div style={{ position: 'absolute', top: -1000000 }}>
        <ProFormText.Password
          fieldProps={{
            autoComplete: 'off',
          }}
          name="old"
          label="旧密码"
          placeholder="旧密码"
        />
      </div>

      {
        oldpwd ? null : <ProFormText.Password
          fieldProps={{
            autoComplete: 'off',
          }}
          name="oldpwd"
          label="旧密码"
          placeholder="旧密码"
          rules={[
            {
              required: true,
              message: '请输入旧密码!',
            },
          ]}
        />
      }


      <ProFormText.Password
        name="password"
        label="新密码"
        placeholder="新密码"
        rules={[
          {
            required: true,
            message: '请输入新密码!',
          },
        ]}
      />
      <ProFormText.Password
        name="cfpwd"
        label="确认新密码"
        placeholder="新密码"
        rules={[
          {
            required: true,
            message: '请输入新密码!',
          },
          ({ getFieldValue }) => ({
            validator(_, value) {
              if (!value || getFieldValue('password') === value) {
                return Promise.resolve();
              }
              return Promise.reject(new Error('两次输入的密码不一致!'));
            },
          }),
        ]}
      />
    </ProForm>
  );
};

function wxlogincode(state, pathname) {
  let obj = new WxLogin({
    self_redirect: false,
    id: 'login_container',
    appid: AppID,
    scope: 'snsapi_login',
    redirect_uri: encodeURIComponent(REDRIECT + "/#" + pathname),
    state: state,
    style: 'white',
    href: 'data:text/css;base64,LmltcG93ZXJCb3ggLnFyY29kZSB7d2lkdGg6IDEwMCU7IG1hcmdpbjogMHB4O2JvcmRlcjogbm9uZX0KLmltcG93ZXJCb3ggLnRpdGxlIHtkaXNwbGF5OiBub25lO30KLmltcG93ZXJCb3ggLmluZm8ge2Rpc3BsYXk6IG5vbmU7fQouc3RhdHVzX2ljb24ge2Rpc3BsYXk6IG5vbmV9Ci5pbXBvd2VyQm94IC5zdGF0dXMge3RleHQtYWxpZ246IGNlbnRlcjt9Cgo=',
  });
}

const Infos = memo(
  (props) => {
    const {
      token: { colorBgThird, colorPrimary },
    } = theme.useToken();

    const { refresh, currentUser } = props;
    const changeUserInfo = async (params) => {
      let res = await doFetch({
        url: '/system/user',
        params: params,
        method: 'PUT',
      });
      if (res.code === 0) {
        await refresh();
      }
    };

    const { pathname } = useLocation();

    return (
      <div>
        <Header {...props}></Header>
        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird }}
        >
          <span>姓名</span>
          <Paragraph
            editable={{
              onChange: (value) => {
                changeUserInfo({
                  name: value,
                });
              },
            }}
          >
            {currentUser?.name}
          </Paragraph>
        </div>
        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird }}
        >
          <span>
            性别{' '}
          </span>
          <Select
            style={{ width: 56 }}
            defaultValue={currentUser.sex}
            onChange={(value) => changeUserInfo({
              sex: value,
            })}
            options={[
              {
                label: '男',
                value: 1,
              },
              {
                label: '女',
                value: 2,
              },
            ]}
          >
          </Select>
        </div>

        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird, marginTop: 16 }}
        >
          <span>岗位</span>
          <Paragraph editable={{
            onChange: (value) => {
              changeUserInfo({
                post: value,
              });
            },
          }}>{currentUser?.post}</Paragraph>
        </div>

        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird, marginTop: 16 }}
        >
          <span>账号{' '}
            <Tooltip
              title="每半年可以修改一次"
              placement='right'
            >
              <QuestionOutlined />
            </Tooltip>{' '}</span>
          <Paragraph editable={{
            onChange: (value) => {
              changeUserInfo({
                userName: value,
              });
            },
          }}>{currentUser?.userName}</Paragraph>
        </div>



        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird }}
        >
          <span>
            电话号码{' '}
            <Tooltip
              title="填写(如:企业微信,钉钉,飞书...)的预留手机号码，以便收到消息提醒"
              placement='right'
              overlayStyle={{ width: 260 }}
            >
              <QuestionOutlined />
            </Tooltip>{' '}
          </span>
          <Paragraph
            editable={{
              onChange: (value) => {
                changeUserInfo({
                  telephone: value,
                });
              },
            }}
          >
            {currentUser?.telephone}
          </Paragraph>
        </div>

        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird }}
        >
          <span>
            {currentUser?.isBindWx ? '解绑微信' : '绑定微信'}{' '}
            <Tooltip
              title="绑定后即可微信扫码登录"
              placement='right'
              overlayStyle={{ width: 170 }}
            >
              <QuestionOutlined />
            </Tooltip>{' '}
          </span>
          {currentUser?.isBindWx ? (
            <Popconfirm
              title="是否解绑微信？"
              placement="bottomRight"
              okText="确认解绑"
              cancelText="取消"
              onConfirm={() => {
                changeUserInfo({
                  wxOpenId: '',
                });
              }}
            >
              <div className="sorts" style={{ width: 60, color: colorPrimary }}>
                解绑
              </div>
            </Popconfirm>
          ) : (
            <Popover
              trigger={'click'}
              placement="bottomRight"
              onOpenChange={async (open) => {
                if (open) {
                  const string = await getFetch({ url: '/wx/bind' });
                  wxlogincode(string?.data?.data, pathname);
                }
              }}
              content={
                <div
                  className="columns"
                  style={{ justifyContent: 'center', alignItems: 'center' }}
                >
                  <span className="center" style={{ gap: 8, marginTop: 20 }}>
                    <WechatFilled style={{ color: '#1AAD19', fontSize: 17 }} />
                    使用微信扫一扫绑定
                  </span>
                  <div
                    id="login_container"
                    style={{
                      width: '190px',
                      height: '190px',
                      margin: '12px auto 13px auto',
                    }}
                  ></div>
                </div>
              }
            >
              <div className="sorts" style={{ color: colorPrimary, cursor: "pointer" }}>
                绑定
              </div>
            </Popover>
          )}
        </div>

        <Divider></Divider>
        <div style={{ margin: '-12px auto 12px auto' }}>
          <span>个性化设置</span>
        </div>

        <div
          className="itemspace w-80"
          style={{ backgroundColor: colorBgThird }}
        >
          <span>主题</span>
          <Switches></Switches>
        </div>

        <div
          className="center"
          style={{ width: '100%', gap: 24, margin: '8px auto 0px auto' }}
        >
          <Bglight pkey="bgUrl" {...props}></Bglight>
          <Bglight pkey="bgUrlDark" {...props}></Bglight>
        </div>
      </div>
    );
  },
  (prev, next) => {
    if (JSON.stringify(prev.currentUser) !== JSON.stringify(next.currentUser)) {
      return false;
    } else {
      return true;
    }
  },
);

const AddPro = memo(
  ({ refresh, defaultid }) => {
    const formRef = useRef();
    return (
      <ProForm
        formRef={formRef}
        layout={'vertical'}
        style={{ marginTop: 24 }}
        grid={true}
        colProps={{
          span: 24,
        }}
        onFinish={async (values) => {
          let res = await postFetch({
            url: '/project',
            params: { ...values },
          });
          if (res?.code === 0) {
            message.success('创建成功!');
            refresh?.();
          }
        }}
        submitter={{
          render: (props) => {
            return [
              <Button
                type="default"
                key="rest"
                onClick={() => props.form?.resetFields()}
              >
                重置
              </Button>,
              <Button
                style={{ flex: 1 }}
                type="primary"
                key="submit"
                onClick={() => {
                  props.form?.submit?.();
                }}
                icon={<IconFont type="icon-tijiao" />}
                loading={props.submitButtonProps?.loading}
              >
                提交
              </Button>,
            ];
          },
        }}
        onValuesChange={(a) => {
          const curvalue = Object.values(a)[0];
          if (Object?.keys(a).includes('userIdList')) {
            formRef?.current?.setFieldsValue({
              userIdList: [...new Set([...(curvalue ?? []), defaultid])],
            });
          }
        }}
        initialValues={{
          userIdList: [defaultid],
        }}
      >
        <Col span={24}>
          <ProForm.Item name={'logoUrl'}>
            <LogoUrl></LogoUrl>
          </ProForm.Item>
        </Col>

        <ProFormText
          name="projectName"
          tooltip="最长为 24 位"
          label="项目名称"
          placeholder="请输入项目名称"
          fieldProps={{
            showCount: true,
            maxLength: 24,
          }}
          colProps={{
            span: 12,
          }}
          rules={[
            {
              required: true,
              message: '请输入项目名称!',
            },
          ]}
        />

        <ProFormDatePicker
          name="deadline"
          label="截止日期"
          rules={[{ required: true, message: '请选择截止日期!' }]}
          fieldProps={{
            style: { width: '100%' },
            disabledDate,
          }}
          colProps={{
            span: 12,
          }}
        />
        <ProFormSelect
          name="userIdList"
          label="选择参与人员"
          mode="multiple"
          request={async () => {
            let res = await getFetch({
              url: '/user/getOrgUserSelection',
              params: {},
            });
            return res?.data?.dataList;
          }}
          placeholder="请选择"
          rules={[{ required: true, message: '请选择参与人员!' }]}
        />
        <ProFormList
          name="stepList"
          initialValue={[
            {
              name: "默认流程"
            }
          ]}
          label="流程"
          alwaysShowItemLabel
          creatorButtonProps={{
            creatorButtonText: '添加流程',
          }}
          min={1}
          rules={[{ required: true, message: '请至少填写一个流程!' }]}
        >
          {(f, index) => {
            return (
              <ProFormGroup key="group">
                <ProFormText name="name" label={`第 ${index + 1} 步`} rules={[{ required: true, message: '请填写流程名称!' }]} />
              </ProFormGroup>
            );
          }}
        </ProFormList>

        {/* <ProForm.Item
          name={'projectTagList'}
          label={'选择标签'}
          initialValue={[]}
          tooltip="进入项目后可自定义标签"
        >
          <Tagtemplate></Tagtemplate>
        </ProForm.Item> */}

        <ProForm.Item
          name={'notice'}
          label={'项目公告'}
        >
          <EditorItem small={true} />
        </ProForm.Item>
      </ProForm>
    );
  },
  (prev, next) => {
    if (JSON.stringify(prev.currentUser) !== JSON.stringify(next.currentUser)) {
      return false;
    } else {
      return true;
    }
  },
);

const EditPro = memo(
  ({ refresh, projectId, defaultValue }) => {
    const formRef = useRef();
    return (
      <ProForm
        formRef={formRef}
        layout={'vertical'}
        style={{ marginTop: 24 }}
        grid={true}
        colProps={{
          span: 24,
        }}
        onFinish={async (values) => {
          let res = await doFetch({
            url: '/project/' + projectId,
            params: { ...values },
            method: 'PUT',
          });
          if (res?.code === 0) {
            refresh?.();
          }
        }}
        submitter={{
          render: (props) => {
            return [
              <Button
                type="default"
                key="rest"
                onClick={() => props.form?.resetFields()}
              >
                重置
              </Button>,
              <Button
                style={{ flex: 1 }}
                type="primary"
                key="submit"
                onClick={() => {
                  props.form?.submit?.();
                }}
                icon={<IconFont type="icon-tijiao" />}
                loading={props.submitButtonProps?.loading}
              >
                提交
              </Button>,
            ];
          },
        }}
        initialValues={defaultValue}
      >
        <Col span={24}>
          <ProForm.Item name={'logoUrl'}>
            <LogoUrl></LogoUrl>
          </ProForm.Item>
        </Col>

        <ProFormText
          name="projectName"
          tooltip="最长为 24 位"
          label="项目名称"
          placeholder="请输入项目名称"
          fieldProps={{
            showCount: true,
            maxLength: 24,
          }}
          colProps={{
            span: 12,
          }}
          rules={[
            {
              required: true,
              message: '请输入项目名称!',
            },
          ]}
        />
        <ProFormDatePicker
          name="deadline"
          label="截止日期"
          rules={[{ required: true, message: '请选择截止日期!' }]}
          fieldProps={{
            style: { width: '100%' },
            disabledDate,
          }}
          colProps={{
            span: 12,
          }}
        />

        <ProForm.Item
          name={'notice'}
          label={'项目公告'}
        >
          <EditorItem small={true} />
        </ProForm.Item>
      </ProForm>
    );
  },
  (prev, next) => {
    if (JSON.stringify(prev.currentUser) !== JSON.stringify(next.currentUser)) {
      return false;
    } else {
      return true;
    }
  },
);

const ItemAE = ({ refresh, stepId, defaultValue, title, extra = {}, userId }) => {
  const formRef = useRef();
  const { token } = theme.useToken();
  const { currentUser, setInitialState, updateUser, initialState: { curpro } } = useCurrentUser();
  let col = { xs: 24, sm: 24, md: 24, lg: 12, xl: 12, xxl: 12 };

  const [form] = Form.useForm();

  const startValue = Form.useWatch('planStart', form) ?? null;
  const endValue = Form.useWatch('planEnd', form) ?? null;

  const disabledStartDate = (current) => {
    // Can not select days before today and today
    return (
      (current && current < dayjs().startOf('day')) ||
      (endValue && current > dayjs(endValue).startOf('day'))
    );
  };

  const disabledEndDate = (current) => {
    // Can not select days before today and today
    return startValue && current < dayjs(startValue).startOf('day');
  };

  return (
    <ProForm
      form={form}
      initialValues={{
        ...defaultValue,
        itemTagList:
          defaultValue?.itemTagList?.map((it) => it?.projectTagId) ?? [],
        type: defaultValue?.type ?? 1,
        userId: userId ?? currentUser.id,
        stepId: stepId ? [defaultValue.projectId ?? curpro.id, stepId] : undefined
      }}
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={col}
      formRef={formRef}
      onFinish={async (values) => {
        const newValue = {
          ...values,
          itemTagList: values?.itemTagList?.map((item) => {
            if (item.length === 19) {
              return {
                id: item,
              };
            } else {
              return {
                name: item,
              };
            }
          }),
        };

        let res = {}, stid = stepId ? stepId : Array.isArray(values.stepId) ? values.stepId[values.stepId.length - 1] : values.stepId;
        if (title === '创建任务') {
          res = await doFetch({
            url: '/item',
            params: {
              ...newValue,
              ...extra,
              stepId: stid,
            },
          });

        } else if (title === '编辑') {
          res = await doFetch({
            url: '/item/' + defaultValue?.id,
            params: { ...newValue, stepId: stid },
            method: 'PUT',
          });
        }
        if (res?.code === 0) {
          refresh?.();
          setInitialState((s) => ({
            ...s,
            updateSelect: uuidv4(),
          }));
        }
      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
    >
      <ProFormText
        name="missionName"
        label="名称"
        placeholder="请输入名称"
        rules={[
          {
            required: true,
            message: '请输入名称!',
          },
        ]}
        colProps={{
          span: 24,
        }}
      />

      <ProFormCascader
        label="选择目标项目/阶段"
        name="stepId"
        tooltip={{
          title: '不放入项目则该任务仅自己可见',
          placement: 'right',
        }}
        fieldProps={{
          showSearch: true,
          showCheckedStrategy: Cascader.SHOW_CHILD
        }}
        request={async () => {
          let res = await getFetch({
            url: '/project/projectStepTree',
            params: {},
          });
          const result = res?.data?.dataList;
          return result;
        }}
        rules={[
          {
            required: true,
            message: '请选择目标项目/阶段!',
          },
        ]}
      ></ProFormCascader>

      <ProFormDependency name={['stepId']}>
        {({ stepId }) => (
          <ProFormSelect
            name="userId"
            label="选择负责人"
            rules={[
              {
                required: true,
                message: '请选择负责人!',
              },
            ]}
            fieldProps={{
              style: { width: '100%' },
            }}
            colProps={col}
            params={{ projectId: stepId?.[0] ?? curpro.id }}
            request={async ({ projectId }) => {
              let res = await getFetch({
                url: '/user',
                params: { projectId: projectId === 0 ? null : projectId },
              });
              const list = res?.data?.dataList ?? [];
              //接口中不存在数据情况当前直
              const curuserId = formRef?.current?.getFieldValue('userId');
              if (!list.some(it => it.id === curuserId)) {
                formRef?.current?.setFieldsValue({ userId: null });
              }

              return list.map((it) => ({
                label: it.name,
                value: it.id,
              }));
            }}
          ></ProFormSelect>
        )}


      </ProFormDependency>


      <Collapse
        bordered={false}
        expandIcon={({ isActive }) => <CaretRightOutlined rotate={isActive ? 90 : 0} />}
        style={{
          width: '100%',
          background: token.colorBgContainer,
          marginBottom: 24
        }}
        defaultActiveKey={currentUser?.guide?.amz}
        items={[
          {
            key: '1',
            label: '更多',
            style: {
              background: token.colorFillAlter,
              borderRadius: token.borderRadiusLG,
              border: 'none',
            },
            children: <Row gutter={8}>
              <ProFormDependency name={['stepId']}>
                {({ stepId }) => {
                  return !stepId || !stepId[1] ? null : (
                    <ProFormSelect
                      name="itemTagList"
                      label="选择标签"
                      tooltip={{
                        title: "输入文本后按 Enter 添加新标签",
                        placement: "right"
                      }}
                      tooltipPosition="bottom"
                      colProps={{ span: 24 }}
                      mode="tags"
                      hidden={title?.includes('任务池')}
                      params={{ projectId: stepId[0] ?? curpro.id }}
                      request={async ({ projectId }) => {
                        let res = await getFetch({
                          url: '/projectTag/selectionByProjectId',
                          params: { projectId },
                        });
                        const result = res?.data?.dataList ?? [];
                        const curvalue = formRef.current.getFieldValue("itemTagList");
                        if (result.some(item => curvalue.includes(item.value)) || curvalue?.length === 0) {
                        } else {
                          formRef.current.setFieldsValue({
                            itemTagList: []
                          })
                        }
                        return res?.data?.dataList;
                      }}
                      placeholder="请选择"
                    />
                  )
                }}
              </ProFormDependency>


              <ProFormDatePicker
                name="planStart"
                label="计划开始时间"
                fieldProps={{
                  style: { width: '100%' },
                  disabledDate: (current) => disabledStartDate(current),
                }}
                colProps={col}
              ></ProFormDatePicker>

              <ProFormDatePicker
                style={{ marginLeft: 10 }}
                name="planEnd"
                label="计划结束时间"
                fieldProps={{
                  style: { width: '100%' },
                  disabledDate: (current) => disabledEndDate(current),
                }}
                colProps={col}
              ></ProFormDatePicker>

              <ProFormDigit
                label="计划工时/(小时)"
                name="planTime"
                min={0}
                max={10000}
                fieldProps={{ precision: 1 }}
                colProps={col}
              />


              <Col span={24}>
                <ProForm.Item
                  name={'remark'}
                  label={'备注'}
                >
                  <EditorItem small={true} />
                </ProForm.Item>
              </Col>



              <ProFormUploadButton
                label="上传附件"
                name="fileList"
                action={`${REACT_APP_URL}/file/upload`}
                fieldProps={{
                  headers: { token: localStorage.getItem('TOKENES') },
                }}
                transform={(value) => {
                  const transvalue = value?.map((it) => {
                    if (it.response) {
                      return it?.response?.data?.dataList?.[0];
                    } else {
                      return it;
                    }
                  });
                  return {
                    fileList: transvalue,
                  };
                }}
              />

            </Row>,
            extra: <Checkbox
              onClick={e => { e.stopPropagation(); }}
              checked={currentUser?.guide?.amz}
              onChange={(e) => {
                updateUser.runAsync({
                  guide: {
                    ...currentUser.guide,
                    amz: e.target.checked ? 1 : 0
                  }
                });
              }}
            >默认展开</Checkbox>
          },
        ]}
      />




    </ProForm>
  );
};

const AddReply = ({ formRef }) => {
  return (
    <ProForm
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      formRef={formRef}
      submitter={false}
    >
      <ProForm.Item
        name={'reply'}
      >
        <EditorItem small={true} style={{ height: 400, overflow: "hidden" }} />
      </ProForm.Item>
    </ProForm>
  );
};

const AddNotice = memo(({ refresh, defaultid }) => {
  const formRef = useRef();
  return (
    <ProForm
      formRef={formRef}
      layout={'vertical'}
      style={{ marginTop: 0 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        let res = await postFetch({
          url: '/announcement',
          params: { ...values },
        });
        if (res?.code === 0) {
          message.success('创建成功!');
          refresh?.();
        }
      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
    >
      <ProForm.Item
        name={'announcement'}
      >
        <EditorItem />
      </ProForm.Item>
    </ProForm>
  );
});
const EditNotice = memo(({ refresh, announcement, id }) => {
  const formRef = useRef();
  return (
    <ProForm
      formRef={formRef}
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        let res = await doFetch({
          url: '/announcement/' + id,
          params: { ...values },
          method: 'PUT',
        });
        if (res?.code === 0) {
          message.success('修改成功!');
          refresh?.();
        }
      }}
      submitter={{
        render: (props) => {
          return [
            <Button type="default" key="rest" onClick={() => props.form?.resetFields()}>
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
      initialValues={{
        announcement,
      }}
    >
      <ProForm.Item
        transform={(value) => {
          return {
            announcement: value ? value?.toHTML?.() : null,
          };
        }}
        name={'announcement'}
      >
        <EditorItem />
      </ProForm.Item>
    </ProForm>
  );
});




const FirstInfos = (props) => {
  const {
    token: { colorBgThird, colorPrimary },
  } = theme.useToken();

  const { refresh, currentUser, changePwd, nomoreNotice } = props;
  const changeUserInfo = async (params) => {
    let res = await doFetch({
      url: '/system/user',
      params: params,
      method: 'PUT',
    });
    if (res.code === 0) {
      await refresh();
    }
  };

  return (
    <div>
      <p>您可以完善以下信息</p>
      <Header {...props}></Header>
      <div
        className="itemspace w-80"
        style={{ backgroundColor: colorBgThird }}
      >
        <span>姓名</span>
        <Paragraph
          editable={{
            onChange: (value) => {
              changeUserInfo({
                name: value,
              });
            },
          }}
        >
          {currentUser?.name}
        </Paragraph>
      </div>
      <div
        className="itemspace w-80"
        style={{ backgroundColor: colorBgThird }}
      >
        <span>
          性别{' '}
        </span>
        <Select
          style={{ width: 56 }}
          defaultValue={currentUser.sex}
          onChange={(value) => changeUserInfo({
            sex: value,
          })}
          options={[
            {
              label: '男',
              value: 1,
            },
            {
              label: '女',
              value: 2,
            },
          ]}
        >
        </Select>
      </div>

      <div
        className="itemspace w-80"
        style={{ backgroundColor: colorBgThird, marginTop: 16 }}
      >
        <span>岗位</span>
        <Paragraph editable={{
          onChange: (value) => {
            changeUserInfo({
              post: value,
            });
          },
        }}>{currentUser?.post}</Paragraph>
      </div>
      <div
        className="itemspace w-80"
        style={{ backgroundColor: colorBgThird, marginTop: 16 }}
      >
        <span>账号{' '}
          <Tooltip
            title="每半年可以修改一次"
            placement='right'
          >
            <QuestionOutlined />
          </Tooltip>{' '}</span>
        <Paragraph editable={{
          onChange: (value) => {
            changeUserInfo({
              userName: value,
            });
          },
        }}>{currentUser?.userName}</Paragraph>
      </div>
      <div
        className="itemspace w-80"
        style={{ backgroundColor: colorBgThird }}
      >
        <span>
          电话号码{' '}
          <Tooltip
            title="填写(如:企业微信,钉钉,飞书...)的预留手机号码，以便收到消息提醒"
            placement='right'
            overlayStyle={{ width: 260 }}
          >
            <QuestionOutlined />
          </Tooltip>{' '}
        </span>
        <Paragraph
          editable={{
            onChange: (value) => {
              changeUserInfo({
                telephone: value,
              });
            },
          }}
        >
          {currentUser?.telephone}
        </Paragraph>
      </div>
      {
        currentUser.defaultPassword?.length === 6 && <>
          <Divider></Divider>
          <div style={{ margin: '-12px auto 12px auto' }}>
            <span>修改密码</span>
          </div>
          <Pwd
            currentUser={currentUser}
            refresh={refresh}
            oldpwd={currentUser.defaultPassword}
          />
        </>
      }

      <div className="centerr" style={{ marginTop: 20, fontWeight: "bold" }}>
        <a onClick={nomoreNotice}>
          不再提示
        </a>
      </div>
    </div>
  );
};

const AEnodes = ({ refresh, initialValues, projectTypeId }) => {
  return (
    <ProForm
      layout={'vertical'}
      style={{ marginTop: 24 }}
      grid={true}
      colProps={{
        span: 24,
      }}
      onFinish={async (values) => {
        if (initialValues?.id) {
          let res = await postFetch({
            url: '/projectType/saveNode',
            params: { ...values, projectTypeId, id: initialValues.id },
          });
          if (res?.code === 0) {
            message.success('修改成功！');
            refresh?.();
          }
        } else {
          let res = await postFetch({
            url: '/projectType/saveNode',
            params: { ...values, projectTypeId },
          });
          if (res?.code === 0) {
            message.success('创建成功！');
            refresh?.();
          }
        }

      }}
      submitter={{
        render: (props) => {
          return [
            <Button
              type="default"
              key="rest"
              onClick={() => props.form?.resetFields()}
            >
              重置
            </Button>,
            <Button
              style={{ flex: 1 }}
              type="primary"
              key="submit"
              onClick={() => {
                props.form?.submit?.();
              }}
              icon={<IconFont type="icon-tijiao" />}
              loading={props.submitButtonProps?.loading}
            >
              提交
            </Button>,
          ];
        },
      }}
      initialValues={initialValues}
    >
      <ProFormRadio.Group
        name="type"
        label="节点类型"
        options={[
          { label: '标准', value: 1 },
          { label: '审批', value: 2 },
        ]}
        rules={[
          {
            required: true,
            message: '请选择节点类型!',
          },
        ]}
        initialValue={0}
      />

      <ProFormText
        name="name"
        tooltip="最长为 24 位"
        label="节点名称"
        placeholder="请输入节点名称"
        fieldProps={{
          showCount: true,
          maxLength: 24,
        }}
        rules={[
          {
            required: true,
            message: '请输入节点名称!',
          },
        ]}
      />
      <ProFormDigit
        name="points"
        label="节点积分"
        placeholder="请输入节点积分"
        fieldProps={{
          showCount: true,
          maxLength: 24,
          min: 0,
          precision: 0
        }}
        rules={[
          {
            required: true,
            message: '请输入节点积分!',
          },
        ]}
      />
      <ProFormDigit
        name="deadline"
        label="预计完成天数"
        placeholder="请输入预计完成天数"
        fieldProps={{
          showCount: true,
          maxLength: 24,
          min: 0,
          precision: 0
        }}
      />
      <ProForm.Item
        name={'standard'}
        label={'节点标准'}
      >
        <EditorItem small={true} />
      </ProForm.Item>
    </ProForm>
  );
};


export {
  Add,
  AddNotice,
  AddPro,
  AddReply,
  EditPro,
  Header,
  Infos,
  ItemAE,
  Join,
  Pwd,
  FirstInfos,
  EditNotice,
  AEnodes
};
